<template>
  <div>
    <van-checkbox v-model="checked" @change="onChange">
      <img slot="icon" slot-scope="props" :src="props.checked ? icon.active : icon.inactive" />
    </van-checkbox>
  </div>
</template>
<script>
export default {
  data() {
    return {
      checked: true,
      icon: {
        active: "../../images/checked.png",
        inactive: "../../images/check.png"
      }
    };
  },
  methods: {
      //根据id判断 更改state里保存的商品数据
      changeGoodsInfo(){
          
      },
      //check改变事件
      onChange(event){
        //   如果为false则重新计算state的信息  并重新调用父组件的getGoodsInfo方法
        if(event == false){
            //从store的goods里删除后  要重新赋值给localstorage
            this.$store.commit("checkGoods",this.getId);
           localStorage.setItem("goods",JSON.stringify(this.$store.state.goods));
            //重新调用父组件的方法渲染
            this.$emit("getGoods");
        }
      }
  },
  props: ["getId"],
  created() {

  }
};
</script>
<style lang="less" scoped>
/deep/.van-checkbox__icon {
  height: 0.4rem;
  margin-top: 0.3rem;
  img {
    width: 0.44rem;
    height: 0.38rem;
  }
}
</style>
